﻿/* ios safari*/
* {
    -webkit-tap-highlight-color: transparent;
}
/*================== button ======================*/

.btn > i {
    display: -webkit-flex;
    -webkit-align-items: center;
    -webkit-flex-flow: column;
    -webkit-justify-content: center;
}

/*================== screen ======================*/

#screen .screen-page {
    display: -webkit-flex;
    -webkit-transform: translate3D(-120%,0,0);
    transition: -webkit-transform 0.3s;
    /*background: red;*/
}

    #screen .screen-page.visible {
        -webkit-transform: translate3D(0,0,0);
        /*background: red;*/
    }

#screen .home-screen .title {
    display: -webkit-flex;
    -webkit-flex-flow: column nowrap;
    -webkit-align-items: center;
    -webkit-justify-content: center;
}

/*================== footer ======================*/

#footer .footer-page {
    display: -webkit-flex;
}

    #footer .footer-page .btn-back {
        display: -webkit-flex;
        -webkit-flex-basis: 0;
        -webkit-flex-grow: 1;
        -webkit-flex-flow: column nowrap;
        -webkit-justify-content: space-around;
        -webkit-align-items: center;
    }

    #footer .footer-page .content {
        -webkit-flex-basis: 0;
        -webkit-flex-grow: 4;
        display: -webkit-flex;
        -webkit-flex-flow: column nowrap;
        -webkit-align-items: stretch;
        -webkit-justify-content: space-around;
    }


#menu-play-keyboard {
    -webkit-flex-flow: row wrap;
}

    #menu-play-keyboard .side {
        /*background: #eee;*/
        -webkit-flex-basis: 0;
        -webkit-flex-grow: 1;
        display: -webkit-flex;
        -webkit-flex-flow: column nowrap;
        -webkit-justify-content: space-around;
    }

        #menu-play-keyboard .side.left {
            -webkit-align-items: flex-start;
        }

        #menu-play-keyboard .side.right {
            -webkit-align-items: flex-end;
        }

    #menu-play-keyboard .middle {
        /*background: #aaa;*/
        -webkit-flex-basis: 0;
        -webkit-flex-grow: 3;
        display: -webkit-flex;
        -webkit-flex-flow: row wrap;
        -webkit-align-items: center;
        -webkit-justify-content: space-around;
    }


#footer .footer-page {
    -webkit-transform: translate3D(-120%,0,0);
    -webkit-transition: -webkit-transform 0.3s;
}

    #footer .footer-page.visible {
        -webkit-transform: translate3D(0,0,0);
    }

    #footer .footer-page .question {
        display: -webkit-flex;
        -webkit-flex-flow: column nowrap;
        -webkit-justify-content: space-around;
    }

        #footer .footer-page .question .actions {
            display: -webkit-flex;
            -webkit-flex-flow: row nowrap;
            -webkit-justify-content: space-around;
        }

    #footer .footer-page .content.with-text .actions {
        display: -webkit-flex;
        -webkit-flex-flow: row nowrap;
        -webkit-justify-content: space-around;
    }

/*================== grid ======================*/

.grid {
    display: -webkit-flex;
    -webkit-flex-flow: row wrap;
    -webkit-align-content: flex-start;
    -webkit-align-items: flex-start;
    -webkit-justify-content: center;
}

    .grid .cell .candidates {
        -webkit-flex-flow: column nowrap;
    }

        .grid .cell .candidates .candidateRow {
            -webkit-align-content: stretch;
            -webkit-align-items: unset;
            display: -webkit-flex;
            -webkit-flex-basis: 0;
            -webkit-flex-flow: row nowrap;
            -webkit-flex-grow: 1;
            -webkit-justify-content: space-around;
        }


        .grid .cell .candidates .candidate {
            -webkit-flex-grow: 1;
            display: -webkit-flex;
            -webkit-flex-flow: column nowrap;
            -webkit-justify-content: center;
        }


    .grid .cell .single {
        display: -webkit-flex;
        -webkit-flex-flow: column nowrap;
        -webkit-justify-content: center;
    }

    .grid .cell.show-candidates .candidates {
        display: -webkit-flex;
    }
